<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 
       JS DOM
         定义：Document Object Model 文档对象模型。也就是 JavaScript 将 HTML 文档的各个组成部分封装为对象。
         作用：- 改变 HTML 元素的内容
               - 改变HTML 元素的样式（CSS）
               - 对 HTML DOM 事件作出反应
               - 添加和删除 HTML 元素
    -->
    
    <h1 id="title">标题</h1> <!-- <h1> 标题的意思-->
    <h2>222222</h2>
    <h3>3333333</h3>


    <script>
        //1.修改第一个h1标签中的文本内容
        //1.1获取DOM对象
        //let h1 = document.querySelector('#title')
        let h1 =document.querySelector('h1');//获取匹配到的一个元素：

        let hs = document.querySelectorAll('h1');//获取匹配到的所有元素
         
        //1.2调用DOM对象中属性或方法(自己查或ai)
        h1.innerHTML = '修改或的内容'
        hs[0].innerHTML ='kkkkk'
            </script>
</body>
</html>